<template>
  <div class="container" style="text-align:center;">
    <div class="hd">
      <h1 class="page_title">心理评估量表</h1>
    </div>
  </div>
  <div class="contaier">
    <div class="weui_cells_title" style="text-indent:2em;">亲爱的妈妈您好！欢迎您的宝宝来到色彩缤纷的世界。伴随着新生命的到来，有些妈妈会有一点不适应，常遇到一些新问题不知如何解决，再加上产后妈妈们的情绪波动比较大，导致不能很好地照顾新生儿。为更好地帮助这些妈妈们顺利度过这段适应期，以更好的状态照顾我们的小宝宝，我们邀请您填写以下量表。为更好地帮助她们，我们需要您的协助。</div>
    <div class="weui_cells weui_cells_form">
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidName}">
        <div class="weui_cell_hd">
          <label>1、我能看到事物有趣的一面，并笑的开心</label>
        </div>
        <div >
        </div>
      </div>
      <div style="margin-left:2em;">
          <label><input name="A" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="A" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="A" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="A" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidCellphone}">
        <div class="weui_cell_hd">
          <label>2、我欣然期待未来的一切</label>
        </div>
        <div class="weui_cell_bd weui_cell_primary">
         
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="B" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="B" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="B" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="B" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell">
        <div class="weui_cell_hd">
          <label>3、当事情出错时，我会不必要地责备自己</label>
        </div>
       
      </div>
       <div style="margin-left:2em;">
          <label><input name="C" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="C" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="C" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="C" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell">
        <div class="weui_cell_hd">
          <label>4、我无缘无故感到焦虑和担心</label>
        </div>
       
      </div>
       <div style="margin-left:2em;">
          <label><input name="D" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="D" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="D" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="D" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell">
        <div class="weui_cell_hd">
          <label>5、我无缘无故感到害怕和惊慌</label>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="E" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="E" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="E" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="E" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidCertNo}">
        <div class="weui_cell_hd">
          <label>6、很多事情冲着我来，使我透不过气</label>
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="F" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="F" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="F" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="F" type="radio" value="3" />D、完全不能 </label><br>
      </div>
       <div class="weui_cell" :class="{'weui_cell_warn' : invalidCertNo}">
        <div class="weui_cell_hd">
          <label>7、我很不开心，以至失眠</label>
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="G" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="G" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="G" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="G" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidCertNo}">
        <div class="weui_cell_hd">
          <label>8、我感到难过和悲伤</label>
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="H" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="H" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="H" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="H" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidCertNo}">
        <div class="weui_cell_hd">
          <label>9、我不开心到哭</label>
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="I" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="I" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="I" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="I" type="radio" value="3" />D、完全不能 </label><br>
      </div>
      <div class="weui_cell" :class="{'weui_cell_warn' : invalidCertNo}">
        <div class="weui_cell_hd">
          <label>10、我想过要伤害自己</label>
        </div>
        <div class="weui_cell_ft">
          <i class="weui_icon_warn"></i>
        </div>
      </div>
       <div style="margin-left:2em;">
          <label><input name="J" type="radio" value="0" />A、同以前一样 </label><br>
          <label><input name="J" type="radio" value="1" />B、没有以前那么多 </label><br>
          <label><input name="J" type="radio" value="2" />C、肯定比以前少 </label><br>
          <label><input name="J" type="radio" value="3" />D、完全不能 </label><br>
      </div>
    </div>
    <div class="weui_cells_title">谢谢您的参与！</div>
    <p style="padding:10px;" class="am-ft-sm am-ft-gray">
    </p>
  </div>
  <a @click="submitPingjia" href="javascript:;" style="margin:5px 8px;" class="weui_btn weui_btn_primary">提交</a>
  <partial name="footer-copyright"></partial>
  </div>
</template>
<style>
.icon-star-color {
  color: #EEEE00;
}

.icon-star-empty-color {
  color: #DDDDDD;
}

.weui_label {
  display: block;
  width: 4em;
}
</style>
<script>
import { showCommonToast, showSuccessToast, hideSuccessToast } from '../../vuex/actions'
import $ from 'jquery'

export default {
  name: 'DeprtessionDetailView',
  vuex: {
    actions: {
      showCommonToast,
      showSuccessToast,
      hideSuccessToast
    }
  },
  data: function () {
    return {
      cardNo: this.$query.params.cardNo,
      age: this.$query.params.age,
      name: this.$query.params.name,
      IDCard: this.$query.params.IDCard,
      pregnancyDT: this.$query.params.pregnancyDT,
      childbirthDT: this.$query.params.childbirthDT,
      A: -1,
      B: -1,
      C: -1,
      D: -1,
      E: -1,
      F: -1,
      G: -1,
      H: -1,
      I: -1,
      J: -1
    }
  },
  methods: {
    submitPingjia: function () {
      if (!this.checkUserInput()) {
        return
      }

      var requestParams = {
        patientId: this.cardNo,
        socre1: this.A,
        socre2: this.B,
        socre3: this.C,
        socre4: this.D,
        socre5: this.E,
        socre6: this.F,
        socre7: this.G,
        socre8: this.H,
        socre9: this.I,
        socre10: this.J
      }

      var self = this
      this.$ajax.get('SubmitTiJiao', 'PostpartumDepression', requestParams).then(function (data) {
        if (data.ResultCode !== '0') {
          this.showCommonToast({ msg: '提交失败，系统或网络发生错误，请稍后再试！' })
          return
        }

        self.showSuccessToast({ msg: '提交评价成功，感谢您的宝贵意见！' }, false)
        window.setTimeout(function () {
          self.hideSuccessToast()
          self.$router.go({ name: 'paperList' })
        }, 1600)
      })
    },
    checkUserInput: function () {
      var self = this

      if (self.A === -1 || self.B === -1 || self.C === -1 || self.D === -1 || self.E === -1 || self.F === -1 || self.G === -1 || self.H === -1 || self.I === -1 || self.J === -1) {
        this.showCommonToast({ msg: '请全部填写' })
        return false
      }

      return true
    }
  },
  ready: function () {
    $(document).ready(function () {
      for (var j = 1; j < 7; j++) {
        for (var i = 1; i < 6; i++) {
          $('#star_img' + j + '_' + i).click(function (e) {
            if ($(this).hasClass('icon-star-empty-color')) {
              for (var m = 1; m < 6; m++) {
                if (m <= $(this).attr('name')) {
                  $('#star_img' + $(this).attr('title') + '_' + m).addClass('icon-star-color').removeClass('icon-star-empty-color')
                } else {
                  $('#star_img' + $(this).attr('title') + '_' + m).addClass('icon-star-empty-color').removeClass('icon-star-color')
                }
              }
            } else {
              for (var n = 1; n < 6; n++) {
                if (n < $(this).attr('name')) {
                  $('#star_img' + $(this).attr('title') + '_' + n).addClass('icon-star-color').removeClass('icon-star-empty-color')
                } else {
                  $('#star_img' + $(this).attr('title') + '_' + n).addClass('icon-star-empty-color').removeClass('icon-star-color')
                }
              }
            }
          })
        }
      }
    })
  }
}
</script>
